<template>
  <div id="viewQuestionView">
    <a-row :gutter="[30, 30]">
      <a-col :md="12" :xs="24">
        <a-tabs default-active-key="answer">
          <a-tab-pane key="answer" title="答案">
            <a-card v-if="form">
              <CodeEditor :value="form.code || ''" />
            </a-card>
          </a-tab-pane>
        </a-tabs>
      </a-col>
    </a-row>
  </div>
</template>

<script setup lang="ts">
import { defineProps, onMounted, ref, watch, withDefaults } from "vue";
import message from "@arco-design/web-vue/es/message";
import CodeEditor from "@/components/CodeEditor.vue";
import {
  QuestionControllerService,
  QuestionSubmitAddRequest,
  QuestionVO,
} from "../../../generated";

interface Props {
  id: string;
}

const props = withDefaults(defineProps<Props>(), {
  id: () => "",
});

let question = ref<QuestionVO>();

let form = ref<QuestionSubmitAddRequest>();

const loadData = async () => {
  const res = await QuestionControllerService.getQuestionSubmitVoByIdUsingGet(
    props.id as any
  );
  if (res.code === 0) {
    question.value = res.data;
    form.value = res.data;
  } else {
    message.error("加载失败，" + res.message);
  }
};

/**
 * 页面加载时，请求数据
 */
onMounted(() => {
  loadData();
});
</script>

<style>
#viewQuestionView {
  max-width: 1400px;
  margin: 0 auto;
}

#viewQuestionView .arco-space-horizontal .arco-space-item {
  margin-bottom: 0 !important;
}
</style>
